<template>
  <div class="yiji">
    <el-dialog title="结果录入" :visible.sync="dialogFormVisible" style="float: left">
      <el-form :model="resultForm" style="margin-top: 20px">
        <el-form-item label="项目名称" :label-width="formLabelWidth">
          <el-input style="width:80%" v-model="resultForm.projName" autocomplete="off" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="项目结果" :label-width="formLabelWidth">
          <el-input style="width:80%" v-model="resultForm.result" placeholder="请输入结果" :rows="3" type="textarea" clearable></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="result">确 定</el-button>
      </div>
    </el-dialog>
    <el-row :gutter="20">
      <el-col :span="6">
        <el-form :inline="true" style="float:left;">
          <el-form-item>
            <el-button type icon="el-icon-back" @click="back">退出</el-button>
          </el-form-item>
          <el-form-item style="width:115px">
            <el-input placeholder="检查检验处" :disabled="true"></el-input>
          </el-form-item>
        </el-form>
      </el-col>
      <el-col :span="18">
        <el-form :inline="true" style="float:left;" :model="patient">
          <el-form-item label="病历号">
            <el-input placeholder :disabled="true" v-model="patient.id"></el-input>
          </el-form-item>
          <el-form-item label="姓名">
            <el-input placeholder :disabled="true" v-model="patient.name"></el-input>
          </el-form-item>
          <el-form-item label="性别">
            <el-input placeholder :disabled="true" v-model="patient.gender"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type icon="el-icon-refresh" @click="rebuild">刷新</el-button>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="6">
        <el-row>
          <el-col :span="24">
            <el-form :model="formInfo" style="float:left;">
              <el-form-item label="用户信息查询：">
                <el-input v-model="formInfo.patient" placeholder="姓名或病历号" clearable></el-input>
              </el-form-item>
              <el-form-item>
                <el-button type style="width:100%" icon="el-icon-search" @click="searchPatient">查询</el-button>
              </el-form-item>
            </el-form>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-tabs type="card" v-model="info">
              <el-tab-pane label="个人" name="myInfo">
                <el-form :model="me" :inline="true" style="float:left; margin-top:80px;">
                  <el-form-item label="姓名：">
                    <el-input v-model="me.name" placeholder :disabled="true"></el-input>
                  </el-form-item>
                  <el-form-item label="科室：">
                    <el-input v-model="me.dept" placeholder :disabled="true"></el-input>
                  </el-form-item>
                  <el-form-item label="职称：">
                    <el-input v-model="me.title" placeholder :disabled="true"></el-input>
                  </el-form-item>
                </el-form>
              </el-tab-pane>
            </el-tabs>
          </el-col>
        </el-row>
      </el-col>
      <el-col :span="18">
        <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
          <el-tab-pane label="检查" name="first">
            <el-table :data="tableDataC" stripe style="width: 100%">
              <el-table-column fixed="left" label="姓名" width="180">
                <template slot-scope="scope">
                  <el-popover trigger="hover" placement="top">
                    <p>姓名: {{ patient.name }}</p>
                    <p>病历号: {{ patient.id }}</p>
                    <p>是否加急: {{ scope.row.hurry }}</p>
                    <div slot="reference" class="name-wrapper">
                      <el-tag size="medium">{{ patient.name }}</el-tag>
                    </div>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column label="项目名" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.projName }}</span>
                </template>
              </el-table-column>
              <el-table-column label="目的要求" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.dist }}</span>
                </template>
              </el-table-column>
              <el-table-column label="检查部位" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.locat }}</span>
                </template>
              </el-table-column>
              <el-table-column label="是否加急" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.hurry }}</span>
                </template>
              </el-table-column>
              <el-table-column fixed="right" label="操作" width="240">
                <template slot-scope="scope">
                  <el-button size="mini" @click="handleEnter(patient.id, scope.row.projName)">执行</el-button>
                  <el-button
                    size="mini"
                    type="danger"
                    @click="handleUnEnter(patient.id, scope.row.projName)"
                  >取消</el-button>
                  <el-button
                    size="mini"
                    type="primary"
                    @click="handleIn(scope.row.projName)"
                  >录入</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <el-tab-pane label="检验" name="second">
            <el-table :data="tableDataY" stripe style="width: 100%">
              <el-table-column fixed="left" label="姓名" width="180">
                <template slot-scope="scope">
                  <el-popover trigger="hover" placement="top">
                    <p>姓名: {{ patient.name }}</p>
                    <p>病历号: {{ patient.id }}</p>
                    <p>是否加急: {{ scope.row.hurry }}</p>
                    <div slot="reference" class="name-wrapper">
                      <el-tag size="medium">{{ patient.name }}</el-tag>
                    </div>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column label="项目名" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.projName }}</span>
                </template>
              </el-table-column>
              <el-table-column label="目的要求" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.dist }}</span>
                </template>
              </el-table-column>
              <el-table-column label="检查部位" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.locat }}</span>
                </template>
              </el-table-column>
              <el-table-column label="是否加急" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.hurry }}</span>
                </template>
              </el-table-column>
              <el-table-column fixed="right" label="操作" width="240">
                <template slot-scope="scope">
                  <el-button size="mini" @click="handleEnter(patient.id, scope.row.projName)">执行</el-button>
                  <el-button
                    size="mini"
                    type="danger"
                    @click="handleUnEnter(patient.id, scope.row.projName)"
                  >取消</el-button>
                  <el-button
                    size="mini"
                    type="primary"
                    @click="handleIn(scope.row.projName)"
                  >录入</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <el-tab-pane label="处置" name="third">
            <el-table :data="tableDataZ" stripe style="width: 100%">
              <el-table-column fixed="left" label="姓名" width="180">
                <template slot-scope="scope">
                  <el-popover trigger="hover" placement="top">
                    <p>姓名: {{ patient.name }}</p>
                    <p>病历号: {{ patient.id }}</p>
                    <p>是否加急: {{ scope.row.hurry }}</p>
                    <div slot="reference" class="name-wrapper">
                      <el-tag size="medium">{{ patient.name }}</el-tag>
                    </div>
                  </el-popover>
                </template>
              </el-table-column>
              <el-table-column label="项目名" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.projName }}</span>
                </template>
              </el-table-column>
              <el-table-column label="目的要求" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.dist }}</span>
                </template>
              </el-table-column>
              <el-table-column label="检查部位" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.locat }}</span>
                </template>
              </el-table-column>
              <el-table-column label="是否加急" width="180">
                <template slot-scope="scope">
                  <span style="margin-left: 10px">{{ scope.row.hurry }}</span>
                </template>
              </el-table-column>
              <el-table-column fixed="right" label="操作" width="240">
                <template slot-scope="scope">
                  <el-button size="mini" @click="handleEnter(patient.id, scope.row.projName)">执行</el-button>
                  <el-button
                    size="mini"
                    type="danger"
                    @click="handleUnEnter(patient.id, scope.row.projName)"
                  >取消</el-button>
                  <el-button size="mini" type="primary" @click="handleIn(scope.row.projName)">录入</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import axios from "axios";
export default {
  name: "Yiji",
  data() {
    return {
      resultForm: {
        projName: '',
        result: ''
      },
      dialogFormVisible: false,
      formLabelWidth: '120px',
      patient: {
        id: "",
        name: "",
        gender: ""
      },
      info: "myInfo",
      me: {
        name: "",
        dept: "",
        title: ""
      },
      activeName: "first",
      formInfo: {
        user: ""
      },
      tableDataC: [],
      tableDataY: [],
      tableDataZ: []
    };
  },
  created() {
    this.getInfo();
  },
  methods: {
    getInfo() {
      var user = JSON.parse(sessionStorage.getItem("user"));
      console.log(user);
      this.me.title = user.title;
      this.me.dept = user.deptId;
      this.me.name = user.name;
      if (sessionStorage.getItem("patient")) {
        var patient = JSON.parse(sessionStorage.getItem("patient"));
        console.log(patient);
        this.patient.id = patient.patientId;
        this.patient.name = patient.name;
        this.patient.gender = patient.gender;
        axios
          .get("/api/yiJi/findProjC", {
            params: {
              patientId: patient.patientId
            }
          })
          .then(res => {
            console.log(res);
            this.tableDataC = res.data;
          })
          .catch(function(error) {
            console.log(error);
          });
        axios
          .get("/api/yiJi/findProjY", {
            params: {
              patientId: patient.patientId
            }
          })
          .then(res => {
            console.log(res);
            this.tableDataY = res.data;
          })
          .catch(function(error) {
            console.log(error);
          });
        axios
          .get("/api/yiJi/findProjZ", {
            params: {
              patientId: patient.patientId
            }
          })
          .then(res => {
            console.log(res);
            this.tableDataZ = res.data;
          })
          .catch(function(error) {
            console.log(error);
          });
      }
    },
    handleEnter(p_id, p_name) {
      console.log(p_id+p_name);
      axios
        .put("/api/yiJi/enter?patientId="+p_id+"&projName="+p_name)
        .then(res => {
          console.log(res.data);
          if (res.data == "1") {
            axios
              .get("/api/yiJi/findProjC", {
                params: {
                  patientId: this.patient.id
                }
              })
              .then(res => {
                console.log(res);
                this.tableDataC = res.data;
              })
              .catch(function(error) {
                console.log(error);
              });
            axios
              .get("/api/yiJi/findProjY", {
                params: {
                  patientId: this.patient.id
                }
              })
              .then(res => {
                console.log(res);
                this.tableDataY = res.data;
              })
              .catch(function(error) {
                console.log(error);
              });
            axios
              .get("/api/yiJi/findProjZ", {
                params: {
                  patientId: this.patient.id
                }
              })
              .then(res => {
                console.log(res);
                this.tableDataZ = res.data;
              })
              .catch(function(error) {
                console.log(error);
              });
              this.$message({
                message: '执行成功',
                type: 'success',
                showClose: true
              });
              console.log("执行成功");
          } else if (res.data == "-1") {
            this.$message({
                message: '查询失败',
                type: 'warn',
                showClose: true
              });
            console.log("查询失败");
          } else {
            this.$message({
                message: '执行失败',
                type: 'error',
                showClose: true
              });
            console.log("执行失败");
          }
        });
    },
    handleUnEnter(p_id, p_name) {
      axios
        .delete("/api/yiJi/unEnter?patientId="+p_id+"&projName="+p_name)
        .then(res => {
          if (res.data == "1") {
            axios
              .get("/api/yiJi/findProjC", {
                params: {
                  patientId: res.data.patientId
                }
              })
              .then(res => {
                console.log(res);
                this.tableDataC = res.data;
              })
              .catch(function(error) {
                console.log(error);
              });
            axios
              .get("/api/yiJi/findProjY", {
                params: {
                  patientId: res.data.patientId
                }
              })
              .then(res => {
                console.log(res);
                this.tableDataY = res.data;
              })
              .catch(function(error) {
                console.log(error);
              });
            axios
              .get("/api/yiJi/findProjZ", {
                params: {
                  patientId: res.data.patientId
                }
              })
              .then(res => {
                console.log(res);
                this.tableDataZ = res.data;
              })
              .catch(function(error) {
                console.log(error);
              });
              this.$message({
                message: '取消执行成功',
                type: 'success',
                showClose: true
              });
              console.log("取消执行成功");
          } else if (res.data == "-1") {
            this.$message({
                message: '查询失败',
                type: 'warn',
                showClose: true
              });
            console.log("查询失败");
          } else {
            this.$message({
                message: '取消执行失败',
                type: 'error',
                showClose: true
              });
            console.log("取消执行失败");
          }
        });
    },
    handleIn(name) {
      this.dialogFormVisible = true;
      this.resultForm.projName=name;
    },
    result(){
      axios
        .put('/api/yiJi/result?patientId='+this.patient.id+'&projName='+this.resultForm.projName+'&result='+this.resultForm.result)
        .then(res => {
          if(res.data == "1"){
            axios
              .get("/api/yiJi/findProjC", {
                params: {
                  patientId: res.data.patientId
                }
              })
              .then(res => {
                console.log(res);
                this.tableDataC = res.data;
              })
              .catch(function(error) {
                console.log(error);
              });
            axios
              .get("/api/yiJi/findProjY", {
                params: {
                  patientId: res.data.patientId
                }
              })
              .then(res => {
                console.log(res);
                this.tableDataY = res.data;
              })
              .catch(function(error) {
                console.log(error);
              });
            axios
              .get("/api/yiJi/findProjZ", {
                params: {
                  patientId: res.data.patientId
                }
              })
              .then(res => {
                console.log(res);
                this.tableDataZ = res.data;
              })
              .catch(function(error) {
                console.log(error);
              });
              this.$message({
                message: '录入成功',
                type: 'success',
                showClose: true
              });
              console.log("录入成功");
          }else if (res.data == "-1") {
            this.$message({
                message: '查询失败',
                type: 'warn',
                showClose: true
              });
            console.log("查询失败");
          } else {
            this.$message({
                message: '录入失败',
                type: 'error',
                showClose: true
              });
            console.log("录入失败");
          }
        });
      this.dialogFormVisible = false;
    },
    searchPatient() {
      console.log(this.formInfo.patient);
      axios
        .get("/api/yiJi/find", {
          params: {
            content: this.formInfo.patient
          }
        })
        .then(res => {
          console.log(res.data);
          this.patient.id = res.data.patientId;
          this.patient.name = res.data.name;
          this.patient.gender = res.data.gender;
          sessionStorage.setItem("patient", JSON.stringify(res.data));
          axios
            .get("/api/yiJi/findProjC", {
              params: {
                patientId: res.data.patientId
              }
            })
            .then(res => {
              console.log(res);
              this.tableDataC = res.data;
            })
            .catch(function(error) {
              console.log(error);
            });
          axios
            .get("/api/yiJi/findProjY", {
              params: {
                patientId: res.data.patientId
              }
            })
            .then(res => {
              console.log(res.data);
              this.tableDataY = res.data;
            })
            .catch(function(error) {
              console.log(error);
            });
          axios
            .get("/api/yiJi/findProjZ", {
              params: {
                patientId: res.data.patientId
              }
            })
            .then(res => {
              console.log(res.data);
              this.tableDataZ = res.data;
            })
            .catch(function(error) {
              console.log(error);
            });
        })
        .catch(function(error) {
          console.log(error);
        });
    },
    handleClick(tab, event) {
      console.log(tab, event);
    },
    back() {
      this.$router.push({ path: "/", replace: true }); //返回上一层
      console.log("返回");
    },
    rebuild() {
      this.$router.go(0);//刷新数据
      console.log("刷新");
    }
  }
};
</script>
<style>
.el-row {
  margin-bottom: 10px;
}
.el-col {
  border-radius: 4px;
}
</style>